<h3 class="page-title mb-5">Settings</h3>
<div>
    <div class="list-group list-group-transparent mb-0">
        <a href="{{ url_for('user_settings.account') }}"
            class="list-group-item list-group-item-action d-flex align-items-center  {{ 'active' if request.endpoint == 'user_settings.account' }}">
            <span class="icon mr-3"><i class="fe fe-user"></i></span>Account Settings
        </a>
        <a href="{{ url_for('user_settings.change_password') }}"
        class="list-group-item list-group-item-action d-flex align-items-center  {{ 'active' if request.endpoint == 'user_settings.change_password' }}">
            <span class="icon mr-3"><i class="fe fe-lock"></i></span>Change Password
        </a>
        <a href="{{ url_for('user_settings.oauth') }}"
        class="list-group-item list-group-item-action d-flex align-items-center  {{ 'active' if request.endpoint == 'user_settings.oauth' }}">
            <span class="icon mr-3"><i class="fa fa-google"></i></span>Linked Accounts
        </a>

        <div class="dropdown-divider"></div>
        <a href="{{ url_for('user_settings.billing') }}"
        class="list-group-item list-group-item-action d-flex align-items-center  {{ 'active' if request.endpoint == 'user_settings.billing' }}">
            <span class="icon mr-3"><i class="fe fe-credit-card"></i></span>Billing
        </a>


        <a href="{{ url_for('user_settings.memberships') }}"
        class="list-group-item list-group-item-action d-flex align-items-center  {{ 'active' if request.endpoint == 'user_settings.memberships' }}">
            <span class="icon mr-3"><i class="fe fe-users"></i></span>Team Memberships
        </a>

        <a href="{{ url_for('user_settings.api') }}"
        class="list-group-item list-group-item-action d-flex align-items-center  {{ 'active' if request.endpoint == 'user_settings.api' }}">
            <span class="icon mr-3"><i class="fe fe-zap"></i></span>API Access
        </a>


        <div class="dropdown-divider"></div>
        <a href="{{ url_for('user_settings.legal_compliance') }}"
        class="list-group-item list-group-item-action d-flex align-items-center  {{ 'active' if request.endpoint == 'user_settings.legal_compliance' }}">
            <span class="icon mr-3"><i class="fe fe-shield"></i></span>Legal & Compliance
        </a>
    </div>
    <div class="mt-6">
        <a href="mailto://{{ constants.SUPPORT_EMAIL }}" class="btn btn-secondary btn-block">
            <span class="icon mr-3"><i class="fe fe-message-square"></i></span>
            Get help
        </a>
    </div>
</div>
